<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ include file="common/tag.jsp"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>提供各种文章阅读学习、资源下载_首页_阅学网</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta name="Keywords"
	content="软件编程、软件开发、文章阅读学习、资源下载、问答">
<meta name="description"
	content="提供丰富的文章供读者阅读学习、海量资源下载">
<%@ include file="common/common.jsp"%>
</head>
<body>
	<div class="yc_container">
		<jsp:include page="top.jsp"></jsp:include>
		<div class="yc_icontent">
			<div class="yc_section_news">
				<div class="leftbar">
						<!--头图轮换-->
							<div class="leftbar-left">
								<c:forEach items="${newsList }" var="news" varStatus="at">
				 					<div>
					 						<a href="public/news/detail/${news.id }" title="${news.newsTitle }">
					 							<img alt="${news.newsTitle }" src="${news.imgUrl }" style="width: 340px;height: 360px;float: left;
						 						<c:if test="${at.index  == 0 }">
													display: block;">
												</c:if>		
						 						<c:if test="${at.index  != 0 }">
													display:none;">
												</c:if>
											</a>
												<c:if test="${at.index  == 0 }">
													<c:set var="newsId" value="${news.id }" />
													<c:set var="newsTitle" value="${news.newsTitle }" />
												</c:if>
												<span style="display: none;" class="newsId">${news.id }</span>
												<span style="display: none;" class="newsTitle">${news.newsTitle }</span>
										</div>
								</c:forEach>
			 				<div class="left-img-num">
				 				<ul >
				 					<li class="left-img-num-li img-current-num"><a href="#">1</a></li>
				 					<li class="left-img-num-li"><a href="#">2</a></li>
				 					<li class="left-img-num-li"><a href="#">3</a></li>
				 					<li class="left-img-num-li"><a href="#">4</a></li>
				 					<li class="left-img-num-li"><a href="#">5</a></li>
				 					<li class="left-img-num-li"><a href="#">6</a></li>
				 				</ul>
			 				</div>
			 				<!-- 标题 -->
			 				<div class="left-img-title">
			 					<a href="public/news/detail/${newsId }" title="${newsTitle }" id="imgNewsTitle">${newsTitle }</a>
			 				</div>
			 			</div>
						<!--头图轮换结束-->
				</div>

				<div class="minbar" style="height: 200px;">
					<div class="yc_inews_tab fl" id="yc_intab">
						<div id="yc_intag">
							<ul>
								<li class="yc-li" style="cursor: pointer;">最新文章</li>
								<li class="" style="cursor: pointer;">最热评论</li>
								<li class="" style="cursor: pointer;">随机推荐</li>
							</ul>
						</div>
						<div class="yc_incont_center">
							<!-- 最新文章 -->
							<div class="yc_incont" style="display: block;">
								<ul>
									<c:forEach items="${articleList }" var="article" >
										<li>
											<a href="public/article/detail/${article.id }">
												<c:choose>
													<c:when test="${fn:length(article.articleTitle) > 28}">${fn:substring(article.articleTitle, 0, 28)}...</c:when>
													<c:otherwise> ${article.articleTitle }</c:otherwise>
												</c:choose>
											</a>
										</li>
									</c:forEach>
								</ul>
							</div>
							<!-- 文章最热评论 -->
							<div class="yc_incont" style="display: none;">
								<ul>
									<c:forEach items="${hotArticleList }" var="hotArticle">
										<li>
											<a href="public/article/detail/${hotArticle.id }">
												<c:choose>
													<c:when test="${fn:length(hotArticle.articleTitle) > 28}">${fn:substring(hotArticle.articleTitle, 0, 28)}...</c:when>
													<c:otherwise> ${hotArticle.articleTitle }</c:otherwise>
												</c:choose>
											</a>
										</li>
									</c:forEach>
								</ul>
							</div>
							<!-- 随机推荐-->
							<div class="yc_incont" style="display: none;">
								<ul>
									<c:forEach items="${recommenRecordList }" var="recommenRecord" varStatus="record">
										<li>
											<a href="public/article/detail/${recommenRecord.id }">
													<c:choose>
														<c:when test="${fn:length(recommenRecord.articleTitle) > 28}">${fn:substring(recommenRecord.articleTitle, 0, 28)}...</c:when>
														<c:otherwise> ${recommenRecord.articleTitle }</c:otherwise>
													</c:choose>
												</a>
											</li>
									</c:forEach>
								</ul>
							</div>
							
						</div>
					</div>
				</div>
				<!-- 完整tab切换end -->

				<div class="rigbar" style="height: 200px;">
					<div class="new-upload">
						<div class="new-upload-title">
							<h3>最新上传</h3>
						</div>
						<div class="new-upload-content" >
							<c:forEach items="${resourceFiles }" var="resourceFile">
										<li class="resource-file-li">
											<div class="resource-file-img">
												<img alt="" src="images/${resourceFile.fileType}" />
											</div>
											<div  class="resource-file-title">
												<a href="public/resource/detail/${resourceFile.id }">
													<c:choose>
														<c:when test="${fn:length(resourceFile.resourceTitle) > 23}">${fn:substring(resourceFile.resourceTitle, 0, 23)}...</c:when>
														<c:otherwise> ${resourceFile.resourceTitle }</c:otherwise>
													</c:choose>
												</a>
											</div>
										</li>
								</c:forEach>
						</div>
					</div>
				</div>
			</div>
			
			<!--热门资源分类  -->
			<div class="sign-in">
				<span>热门资源</span>
			</div>
			<div style="float: left;">
				<!-- 中间左部分 -->
				<div class="center-left-bar">
						<!--  中间左部分-上 -->
					<div style="float: left;width: 100%;">
						<div class="dqinfo" style="margin-right: 10px; margin-top: 3px;">
							<div class="title">
								<img src="images/li.png" class="title-img">
								<h3 style="text-align: left;">后台开发</h3>
								<a href="public/article/articleList/1"	class="dq_more">更多>></a>
							</div>
							<div class="content">
								<ul class="list">
									<c:forEach items="${articleBackDev}" var="article">
											<li>
													<div class="index-article-title">
														<a target="_blank" href="public/article/detail/${article.id }">
																<c:choose>
																	<c:when test="${fn:length(article.articleTitle) > 22}">${fn:substring(article.articleTitle, 0, 22)}...</c:when>
																	<c:otherwise> ${article.articleTitle }</c:otherwise>
																</c:choose>
														</a>
													</div>
													<div class="index-article-date">
														<span><fmt:formatDate value="${article.modifyDate }" pattern="MM-dd"/></span>
													</div>
											</li>
									</c:forEach>
								</ul>
							</div>
					</div>
					<div class="dqinfo" style="margin-top: 3px;">
						<div class="title">
							<img src="images/li.png" class="title-img">
							<h3 style="text-align: left;">数据库</h3>
							<a href="public/article/articleList/2"	class="dq_more">更多>></a>
						</div>
						<div class="content">
							<ul class="list" id="article1">
								<c:forEach items="${articleDatabase}" var="article">
									<li>
										<div class="index-article-title">
											<a target="_blank"	href="public/article/detail/${article.id }">
													<c:choose>
														<c:when test="${fn:length(article.articleTitle) > 22}">${fn:substring(article.articleTitle, 0, 22)}...</c:when>
														<c:otherwise> ${article.articleTitle }</c:otherwise>
													</c:choose>
											</a>
										</div>
										<div class="index-article-date">
												<span><fmt:formatDate value="${article.modifyDate }" pattern="MM-dd"/></span>
										</div>
									</li>
								</c:forEach>
							</ul>
						</div>
					</div>
					<div class="dqinfo" style="margin-right: 10px; margin-top: 12px;">
						<div class="title">
							<img src="images/li.png" class="title-img">
							<h3 style="text-align: left;">前端开发</h3>
							<a href="public/article/articleList/3"	class="dq_more">更多>></a>
						</div>
						<div class="content">
							<ul class="list">
								<c:forEach items="${articleFront}" var="article">
									<li>
										<div class="index-article-title">
											<a target="_blank" href="public/article/detail/${article.id }">
													<c:choose>
														<c:when test="${fn:length(article.articleTitle) > 22}">${fn:substring(article.articleTitle, 0, 22)}...</c:when>
														<c:otherwise> ${article.articleTitle }</c:otherwise>
													</c:choose>
											</a>
										</div>
										<div class="index-article-date">
												<span><fmt:formatDate value="${article.modifyDate }" pattern="MM-dd"/></span>
										</div>
									</li>
								</c:forEach>
							</ul>
						</div>
					</div>
					<div class="dqinfo" style="margin-top: 12px;">
						<div class="title">
							<img src="images/li.png" class="title-img">
							<h3 style="text-align: left;">服务器</h3>
							<a href="public/article/articleList/4"	class="dq_more">更多>></a>
						</div>
						<div class="content">
							<ul class="list">
								<c:forEach items="${articleServer}" var="article">
										<li>
											<div class="index-article-title">
												<a target="_blank" href="public/article/detail/${article.id }">
													<c:choose>
														<c:when test="${fn:length(article.articleTitle) > 22}">${fn:substring(article.articleTitle, 0, 22)}...</c:when>
														<c:otherwise> ${article.articleTitle }</c:otherwise>
													</c:choose>
												</a>
											</div>
											<div class="index-article-date">
												<span><fmt:formatDate value="${article.modifyDate }" pattern="MM-dd"/></span>
											</div>
										</li>
								</c:forEach>
							</ul>
						</div>
					</div>
					<div class="dqinfo" style="margin-right: 10px; margin-top: 12px;">
						<div class="title">
							<img src="images/li.png" class="title-img">
							<h3 style="text-align: left;">
								<span>云计算</span>
							</h3>
							<a href="public/article/articleList/5"	class="dq_more">更多>></a>
						</div>
						<div class="content">
							<ul class="list">
								<c:forEach items="${articleCloud}" var="article">
									<li>
										<div class="index-article-title">
											<a target="_blank" href="public/article/detail/${article.id }">
													<c:choose>
														<c:when test="${fn:length(article.articleTitle) > 22}">${fn:substring(article.articleTitle, 0, 22)}...</c:when>
														<c:otherwise> ${article.articleTitle }</c:otherwise>
													</c:choose>
											</a>
										</div>
										<div class="index-article-date">
												<span><fmt:formatDate value="${article.modifyDate }" pattern="MM-dd"/></span>
										</div>
									</li>
								</c:forEach>
							</ul>
						</div>
					</div>
					<div class="dqinfo" style="margin-top: 12px;">
						<div class="title">
							<img src="images/li.png" class="title-img">
							<h3 style="text-align: left;">大数据</h3>
							<a href="public/article/articleList/6"	class="dq_more">更多>></a>
						</div>
						<div class="content">
							<ul class="list">
								<c:forEach items="${articleHadoop}" var="article">
									<li>
										<div class="index-article-title">
												<a target="_blank"	href="public/article/detail/${article.id }">
														<c:choose>
															<c:when test="${fn:length(article.articleTitle) > 22}">${fn:substring(article.articleTitle, 0, 22)}...</c:when>
															<c:otherwise> ${article.articleTitle }</c:otherwise>
														</c:choose>
												</a>
										</div>
										<div class="index-article-date">
												<span><fmt:formatDate value="${article.modifyDate }" pattern="MM-dd"/></span>
										</div>
									</li>
								</c:forEach>
							</ul>
						</div>
					</div>
				</div>
				
				<!--   图书推荐 -->
				<div class="book-list">
						<div class="book-list-title">
								热门书籍
						</div>
						<div class="book-list-detail">
							<ul>
								<c:forEach items="${books }" var="book">
									<li>
										<div>
											<a target="_blank" href="public/book/detail/${book.id}">
												<img alt="${book.bookName }" src="${book.bookImg }" />
											</a>
										</div>
										<div class="book-name">
											<a target="_blank" title="${book.bookName }" href="public/book/detail/${book.id}">
												${book.bookName }
											</a>
										</div>
									</li>
								</c:forEach>
							</ul>
						</div>
					</div>
					
					<!-- 友情链接 -->
					<div class="link-list">
						<div class="link-list-title">
								友情链接
						</div>
						<div class="link-list-detail">
							<ul>
								<c:forEach items="${links }" var="link">
									<li>
										<a title="${link.linkName }" target="_blank" href="${link.linkUrl}">${link.linkName }</a>
									</li>
								</c:forEach>
							</ul>
						</div>
					</div>
				</div>
				
				<!-- 中间右部分 -->
				<div class="center-right-bar">
						<!-- 最新动态 -->
						<div class="new-moments-list" style="margin-bottom: 70px;">
							<ul>
								<li>
									<span style="float: left;"><h3>最新动态</h3></span>
									<span class="new-moments-list-more">
										<a class="#">更多</a></span>
								</li>
							</ul>
						</div>
						
						<!-- 最新评论 -->
						<div class="new-article-comment-list">
							<div class="new-article-comment-list-title">
								最新评论
							</div>
							<div  class="new-article-comment-list-detail">
								<ul>
									<c:forEach items="${newArticels}" var="newArticel">
										<li>
											<div class="new-article-comment-list-detail-img" >
												<a href="public/userLand/${newArticel.creater }" title="${newArticel.chName}" target="_blank">
													<img title="${newArticel.chName }" alt="${newArticel.chName }" src="public/user/showPicture/${newArticel.creater }" >
												</a>
											</div>
											<div class="new-article-comment-list-detail-content">
												<div style="height: 20px;color: #0099FF;">类别：${newArticel.articleTypeName }</div>
												<div style="height: 20px;">评论于：
													<a href="public/article/detail/${newArticel.id }">
														<c:choose>
															<c:when test="${fn:length(newArticel.articleTitle) > 16}">${fn:substring(newArticel.articleTitle, 0, 16)}...</c:when>
															<c:otherwise> ${newArticel.articleTitle }</c:otherwise>
														</c:choose>
													</a>
												</div>
												<div style="height: 30px;color: #FF784E;">
													<c:choose>
														<c:when test="${fn:length(newArticel.commentContent) > 20}">${fn:substring(newArticel.commentContent, 0, 20)}...</c:when>
														<c:otherwise> ${newArticel.commentContent }</c:otherwise>
													</c:choose>
												</div>
											</div>
										</li>
									</c:forEach>
								</ul>
							</div>
						</div>
						
						<!-- 最新注册用户 -->
						<div class="new-register-user-list">
							<div class="register-user-list-title">
								最新注册用户
							</div>
							<div id="lastRegisterUser">
							</div>
						</div>
						
						<!-- 我的栏目 -->
						<div class="article-type-col-list">
							<div class="article-type-col-list-title">
								我的栏目
							</div>
							<div>
								<ul class="label-list">
									<c:forEach items="${articleTypeColList }" var="articleType" varStatus="at">
										<li>
											<a target="_blank" href="public/article/articleTypeList/${articleType.id}">${articleType.articleTypeName }</a>
										</li>
									</c:forEach>
								</ul>
							</div>
						</div>
						
						<!-- 排行榜 -->
						<div class="ranking-list">
							<div class="ranking-list-title" >
								积分排行榜
							</div>
							<div class="ranking-list-detail">
								<ul>
									<c:forEach items="${userRanks }" var="userRank" varStatus="rank">
										<li>
											<c:if test="${rank.index+1 ==1}">
												<div class="rank-style rank-1">${rank.index+1}</div>
											</c:if> 
											<c:if test="${rank.index+1 ==2}">
												<div  class="rank-style rank-2" >${rank.index+1}</div>
											</c:if> 
											<c:if test="${rank.index+1 ==3}">
												<div  class="rank-style rank-3" >${rank.index+1}</div>
											</c:if> 
											<c:if test="${rank.index+1 >3}">
												<div  class="rank-style rank-gt4" >${rank.index+1}</div>
											</c:if>
											<div style="width: 120px; margin-left: 4px; float: left; font-size: 13px;">
													<a href="public/userLand/${userRank.id }" title="${userRank.chName}" target="_blank">
														${userRank.chName}
													</a>
											</div>
											<div
												style="float: left; color: #888888; width: 110px; font-size: 13px;">${userRank.integral}</div>
											<div style="float: left;border-radius:40px;
						               		 	<c:if test="${userRank.grade <5}">background:#999999</c:if>
						               		 	<c:if test="${userRank.grade >=5 && userRank.grade <10}">background:#468847</c:if>
						               		 	<c:if test="${userRank.grade >=10 && userRank.grade <15}">background:#F89406</c:if>
						               		 	<c:if test="${userRank.grade >=15 && userRank.grade <25}">background:#FF0000</c:if>
						               		 	<c:if test="${userRank.grade >=25}">background:#189AE5</c:if>
		               		 					;color: #fff;width: 40px;text-align: center;height:22px;line-height:22px;">LV${userRank.grade}</div>
										</li>
									</c:forEach>
								</ul>
							</div>
					</div>
				</div>
			</div>
		</div>
	</div>

	<!-- 底部 -->
	<footer class="yc_footer"> 
		<jsp:include page="bottom.jsp"></jsp:include>
	</footer>

</body>
</html>
